// JavaScript Document
radar=
{
	canvas:null,
	initCanvas:function(){
		radar.canvas = document.createElement('canvas');
		radar.canvas.width = 31;
		radar.canvas.height = 326;
		radar.canvas.style.border = "5px inset brown";
	},
	test:function(){
		var context1 = radar.canvas.getContext('2d');
		context1.font = "Bold 40px Arial";
		context1.fillStyle = "rgba(255,0,0,0.95)";
    	context1.fillText('Hello, world!', 0, 50);
	},
	drawRadar:function(dist){
		var context = radar.canvas.getContext('2d');
		context.clearRect ( 0 , 0 , radar.canvas.width , radar.canvas.height );
		
		context.font = "Bold 10px Arial";
		context.fillStyle = "rgba(255,255,0,0.95)";
		var distText = Math.round(dist)
    	context.fillText(distText+ "m", 4, 10);
		
		var r, g=100, b;
		r=0;
		b=256;
		
		maxDist = 200;
		var bound = Math.round(dist / maxDist*320);
		//console.log(bound);
		for(var i = 320; i >= bound; ) {
			context.beginPath();
		
			var color = 'rgb('+r+', ' + '50, ' + g + ')';
			context.fillStyle = color;
			r+=4;
			b-=4;
			
			context.fillRect(3, i, 25, 4);
			//context.fillStyle = "#FFFFFF";
			i-=5;
			//context.fillRect(0, i,  50, 2);
			//i+=2;
		}
	},
	
	
};